<template>
  <view class="beijing">
    <u-collapse>
      <u-collapse-item name="guide" v-for="(item1,i) in items" :key="i">
        <div class="parent-wrapper" slot="title">{{item1.articleCategoryName}}</div>
        <view class="kuang" v-for="(item2,index) in item1.articleDtos" :key="index" @click="navigateTo(item2.id)">
          <text class="pob">{{item2.title}}</text>
        </view>
      </u-collapse-item>
    </u-collapse>
  </view>
</template>

<script>
  import {
    aboutPlatform,
    getDetailform
  } from "@/api/login";
  export default {
    data() {
      return {
        items: [],
      }
    },
    onLoad() {
      this.getData()
    },
    methods: {
      getData() {
        aboutPlatform({
          type: "PLATFORM_INFORMATION"
        }).then(res => {
          console.log("@@@@@@", res)
          if (res.data.success) {
            this.items = res.data.result
          }
        })
      },
      send(e) {
        console.log(e.title)
      },
      navigateTo(id) {
        uni.navigateTo({
          url: '/pages/mine/help/tip?id=' + id,
        })
      },
    }
  }
</script>

<style lang="scss">
  .parent-wrapper {
    padding: 0 32upx;
    height: 80upx;
    display: flex;
    align-items: center;
  }

  .pob {
    color: #262626;
    font-size: 28rpx;
  }

  .beijing {
    background: #fff;
    margin: 10px;
    border-radius: 10px;
    overflow: hidden;
    box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.05);
  }

  .kuang {
    position: relative;
    display: flex;
    align-items: center;
    padding: 0 32upx;
    height: 100upx;
    align-items: center;
    background-color: #fff;
    border-top: 2upx solid #f2f2f2;
  }
</style>
